<html>
  <body>
    <form
      action="javascript:void(0)"
      onsubmit="this.setAttribute('event', 'submit')"
    >
      <input
        type="text"
        onchange="this.setAttribute('event', 'input-change')"
      />

      <hr />

      <input
        type="date"
        onchange="this.setAttribute('event', 'input-date-change')"
      />

      <hr />

      <input
        type="datetime-local"
        onchange="this.setAttribute('event', 'input-datetime-local-change')"
      />

      <hr />

      <input
        type="time"
        onchange="this.setAttribute('event', 'input-time-change')"
      />

      <hr />

      <input
        type="month"
        onchange="this.setAttribute('event', 'input-month-change')"
      />

      <hr />

      <select multiple>
        <option value="a">A</option>
        <option value="b">B</option>
        <option value="c">C</option>
        <option value="c">CC</option>
      </select>

      <hr />

      <textarea
        onchange="this.setAttribute('event', 'textarea-change')"
        cols="30"
        rows="10"
      ></textarea>

      <hr />

      <div contenteditable="true"></div>

      <hr />

      <input type="file" name="files" multiple />

      <hr />

      <label>
        <input type="checkbox" />
        checkbox
      </label>

      <hr />

      <input
        id="blur"
        type="text"
        placeholder="placeholder"
        onblur="this.setAttribute('a', 'ok')"
      />

      <hr />

      <input
        type="color"
        onchange="this.setAttribute('event', 'input-color-change')"
      />

      <hr />

      <button type="button" id="EnabledButton">Enabled Button</button>

      <button type="button" id="DisabledButton" disabled>
        Disabled Button
      </button>

      <hr />

      <input type="submit" value="submit" />
    </form>
  </body>
</html>
